.layout-container{
    position: relative;


    .layout-header-container{
        background-color: #f63;
        height: 50px;
        width: 100%;
        position: fixed;
        top: 0;
        color: #fff;
        padding: 0 10px;
        z-index: 111111;
        text-align: center;
        line-height: 50px;
        display: flex;
        flex-direction: row;

        .city{
            position: relative;
            padding-right: 17px;
            color: #fff;
            max-width: 60px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            display: block;

            &:after{
                border: 1px solid #fff;
                position: absolute;
                right: 2px;
                top: 50%;
                margin-top: -8px;
                display: block;
                content: "";
                width: 8px;
                height: 8px;
                border-top: none;
                border-right: none;
                transform: rotate(-45deg);
            }
        }

        .search{
            width: 100%;
            margin: 0 10px;
            .van-search{
                padding: 0;
                margin-top: 10px;
                border-radius: 20px;
                height: 30px;

                .van-search__wrap{
                    border-radius: 20px;
                    height: 30px;
                    padding-top: 6px;
                    .van-search__input{
                        border-radius: 0px;
                        padding-left: 5px;
                    }
                }

            }
        }
        .self{
            display: block;
            width: 50px;
            padding-right: 15px;
            height: 100%;
            padding-top: 2px;
            font-size: 20px;
        }
    }

    .layout-body-container{
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .layout-footer-container{

    }

}